<link rel="stylesheet" href="__STATIC__/css/login.css?v={$version}" media="all">

<div id="video-container" class="video-container" style="display: none;">
      <video muted="" loop="loop" autoplay="autoplay" class="video" id="video-home" data-object-fit="" style="">抱歉，您的浏览器不支持内嵌视频</video>
</div>


<div class="main-body">
    <div class="login-main">
        <div class="login-top">
            <span>OrziceApi管理中心</span>
            <span class="bg1"></span>
            <span class="bg2"></span>
        </div>
        <form class="layui-form login-bottom">
            <div class="center">
                <div class="item">
                    <span class="icon icon-2"></span>
                    <input type="text" name="username" lay-verify="required"  placeholder="请输入登录账号" maxlength="24"/>
                </div>

                <div class="item">
                    <span class="icon icon-3"></span>
                    <input type="password" name="password" lay-verify="required"  placeholder="请输入密码" maxlength="20">
                    <span class="bind-password icon icon-4"></span>
                </div>

                <div id="validatePanel" class="item" style="width: 137px;">
                    <input type="text" name="captcha" placeholder="请输入验证码" maxlength="4">
                    <img id="refreshCaptcha" class="validateImg"  src="{:url('login/captcha')}" onclick="this.src='{:url(\'login/captcha\')}?seed='+Math.random()">
                </div>

            </div>
            <div class="tip">
                <span class="icon-nocheck icon-check"></span>
                <span class="login-tip">保持登录</span>
            </div>
            <div class="layui-form-item" style="text-align:center; width:100%;height:100%;margin:0px;">
                <button class="login-btn" lay-submit>立即登录</button>
            </div>
        </form>
    </div>
</div>
<div class="footer">
    由开源项目 <a target="_blank" href="https://github.com/orzice/orziceapi">OrziceApi</a> 提供技术支持！
</div>
<script type="text/javascript">
require(["jquery", "easy-admin"], function ($, ea) {
            
            if (!ea.checkMobile()) {
                $('#video-container').attr('style','display: block;');
            };
      
            if (top.location !== self.location) {
                top.location = self.location;
            }

            $('.bind-password').on('click', function () {
                if ($(this).hasClass('icon-5')) {
                    $(this).removeClass('icon-5');
                    $("input[name='password']").attr('type', 'password');
                } else {
                    $(this).addClass('icon-5');
                    $("input[name='password']").attr('type', 'text');
                }
            });

            $('.icon-nocheck').on('click', function () {
                if ($(this).hasClass('icon-check')) {
                    $(this).removeClass('icon-check');
                } else {
                    $(this).addClass('icon-check');
                }
            });
            
            $('.login-tip').on('click', function () {
                $('.icon-nocheck').click();
            });

            ea.listen(function (data) {
                data['keep_login'] = $('.icon-nocheck').hasClass('icon-check') ? 1 : 0;
                return data;
            }, function (res) {
                ea.msg.success(res.msg, function () {
                    window.location = ea.url('index');
                })
            }, function (res) {
                ea.msg.error(res.msg, function () {
                    $('#refreshCaptcha').trigger("click");
                });
            });
            $('#video-home').attr('src','/static/common/mp4/banner.mp4')
});
</script>